<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>您好!</title>
    <!-- <link rel="shortcut icon" href="favicon.ico">-->
    <link rel="stylesheet" href="dist/css/style.min.css">
    <link rel="stylesheet" href="dist/css/fontello.min.css">
    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
        ga('create', 'UA-48084758-4', 'auto');
        ga('send', 'pageview');

    </script>
    <style type="text/css"> 
		p{ 
			text-indent: 2em; /*em是相对单位，2em即现在一个字大小的两倍*/ 
		} 
		@media only screen and (max-width: 1200px) {
			.sidebar{
				display: block;
			}
			.main{
				left: 300px;
				width: 720px;
			}
		}
		@media only screen and (max-width: 980px) {
			.sidebar{
				display: none;
			}
			.main{
				left: 0;
				width: 100%;
				padding: 0px 0px 10000px;
			}
			
		}
		@media only screen and (max-width: 640px) {
			.sidebar{
				display: none;
			}
			.main{
				left: 0;
				width: 100%;
				padding: 0px 0px 10000px;
			}
		}
		.extend{
			border-bottom:1px dashed #fff;
			cursor: help;
		}
	</style> 
	<link rel="stylesheet" href="./css/pictureViewer.css">
	<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/jquery.mousewheel.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/pictureViewer.js"></script>
	<script src="js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
    <div class="container">
        <div class="sidebar">
            <div class="title">
                <h1>郑忠毅的简历</h1>
                <h2>"身体和灵魂总有一个要在路上。"</h2>
            </div>
            <ul class="side-info">
                <li class="someRight">
                    <dt><i class="icon-bookmark"></i>联系方式</dt>
                    <dd><i class="icon-mail-alt"></i>邮箱: <a href="mailto:2869775223@qq.com" target="_blank">2869775223@qq.com</a></dd>
                 	<dd><i class="icon-phone-1"></i>手机: <a>15366125360</a></dd>
                 	<dd><i class="icon-qq"></i>  QQ: <a href="http://wpa.qq.com/msgrd?v=3&uin=2869775223&site=qq&menu=yes" target="_blank">2869775223</a></dd>
                </li>
                <li class="someRight">
                    <dt><i class="icon-bookmark"></i>应聘岗位</dt>
                    <dd>前端工程师</dd>
                    <dd> <span class="extend" title="优先级低">项目经理助手</span></dd>
                </li>
                <li class="skill">
                    <dt><i class="icon-bookmark"></i>技能点</dt>
                    <dd>
                        <div class="skill-name">JavaScript</div>
                        <div class="skill-bar-wrap">
                            <div class="skill-bar" style="width: 80%"></div>
                        </div>
                    </dd>
                    <dd>
                        <div class="skill-name">HTML</div>
                        <div class="skill-bar-wrap">
                            <div class="skill-bar" style="width: 75%"></div>
                        </div>
                    </dd>
                    <dd>
                        <div class="skill-name">CSS</div>
                        <div class="skill-bar-wrap">
                            <div class="skill-bar" style="width: 72%"></div>
                        </div>
                    </dd>
                    <dd>
                        <div class="skill-name">Java</div>
                        <div class="skill-bar-wrap">
                            <div class="skill-bar" style="width: 50%"></div>
                        </div>
                    </dd>
                    
                </li>
            </ul>
			<div id="skillDiv" style="width: 100%;height:400px;"></div>
            <div class="note">
                <p>我是一个充满活力、对前端由衷热爱、善于发现问题的前端工程师。</p>
                <p>我目前正在寻找前端工程师岗位，希望借此机会为贵司献上我的一点绵薄之力，快招我到碗里来吧！</p>
            </div>
        </div>
        <div class="main">
            <ul class="main-info">
                <li class="someRight">
                    <dt><i class="icon-bookmark"></i>基本信息</dt>
                    <dd><span>姓名:</span> 郑忠毅   </dd>
                    <dd><span>性别:</span> 男 </dd>
                    <dd><span>年龄:</span> 24岁</dd>
                    <dd><span>开始工作时间:</span>2016年6月16日</dd>
					<dd><span>工作经历:</span>2016年6月16日</dd>
					<dd><span>目标岗位:</span>前端工程师（网页制作，大数据可视化，html5响应式开发，混合开发，小程序，微信公众号）</dd>
                </li>
                <li>
                    <dt><i class="icon-bookmark"></i>项目与工作经验</dt>
                    <h3>江苏昌信软件科技有限公司（2017.3 - ~）</h3>
                    <br />
                    <ul class="exp">
						<li>
						    <div class="circle"></div>
						    <h4>公安大数据指挥服务中心大屏</h4>
						    <ul>
						    	<li>1</li>
						    	<li>2</li>
						    	<li>3</li>
						    </ul>
						    <img class="cover" src="img/ecg.png">
						</li>
						<li>
						    <div class="circle"></div>
						    <h4>前端通用控件</h4>
						    <ul>
						    	<li>1</li>
						    	<li>2</li>
						    	<li>3</li>
						    </ul>
						    <img class="cover" src="img/ecg.png">
						</li>
                    	<li>
                            <div class="circle"></div>
                            <h4>南瑞输电线路分布式故障终端系统</h4>
                            <ul>
                            	<li>1</li>
                            	<li>2</li>
                            	<li>3</li>
                            </ul>
                            <img class="cover" src="img/ecg.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>扬州党建</h4>
                            <ul>
                            	<li>1</li>
                            	<li>2</li>
                            	<li>3</li>
                            </ul>
                            <img class="cover" src="img/ecg.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>智慧工地</h4>
                            <ul>
                            	<li>1</li>
                            	<li>2</li>
                            	<li>3</li>
                            </ul>
                            <img class="cover" src="img/ecg.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>
								<span>南京林业大学工程培训中心</span>
								<a href="http://gpzx.njfu.edu.cn" target="_blank"><i class="icon-link"></i>http://gpzx.njfu.edu.cn</a>
							</h4>
							
                            <ul>
                            	<li>1</li>
                            	<li>2</li>
                            	<li>3</li>
                            </ul>
                            <img class="cover" src="img/ecg.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>江开教务系统</h4>
                            <ul>
                            	<li>1</li>
                            	<li>2</li>
                            	<li>3</li>
                            </ul>
                            <img class="cover" src="img/ecg.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>西研院开关类设备大数据</h4>
                            <ul>
                            	<li>1</li>
                            	<li>2</li>
                            	<li>3</li>
                            </ul>
                            <img class="cover" src="img/ecg.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>ECAP电商分析产品（2016.6 - 2016.12）[河南,湖北项目已上线]</h4>
                            <p>参与 "ECAP电商分析产品" 的前端开发工作，独立完成了营销分析模块的所有页面，并将其他3个模块，近20个页面的bug扫除干净，达到上线的标准。</p>
                            <p>ZRender用来完成各种复杂图表的绘制，同时使用ECharts完成简单图表的展现，而表格数据的展现使用EasyUI。后端使用spring mvc+MyBatis框架。</p>
                            <img class="cover"src="img/ecap.png">
                            <img class="cover"src="img/ll.png">
                        </li>
                    </ul>
                    <h3>北京亚信智慧数据科技有限公司（2016.6 - 2017.3）</h3>
                    <br />
                    <ul class="exp">
                        <li>
                            <div class="circle"></div>
                            <h4>中信集团企业画像移动端应用-企画师（2016.12 - 2017.3）[上线阶段]</h4>
                            <p>参与 "中信集团企业画像移动端应用-企画师" 的前端开发工作，根据高保真完成项目的前端页面，完成了关系图谱-风险信息,关系图谱-基础画像,关系图谱-对外投资,地图寻踪等模块的所有页面,项目组与移动端项目组合作在Android与IOS端同步上线。</p>
                            <p>前端使用 RequireJS框架和ZRender（Canvas类库）来完成图谱的绘制，同时ECharts用来更好的表现图表信息，后端使用spring mvc+MyBatis框架，其中关系图谱模块使用图数据库Neo4j来完成数据存储。</p>
                            <img class="cover" src="img/ecg.png">
                            <img class="cover" src="img/in.png">
                            <img class="cover" src="img/dis.png">
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>ECAP电商分析产品（2016.6 - 2016.12）[河南,湖北项目已上线]</h4>
                            <p>参与 "ECAP电商分析产品" 的前端开发工作，独立完成了营销分析模块的所有页面，并将其他3个模块，近20个页面的bug扫除干净，达到上线的标准。</p>
                            <p>ZRender用来完成各种复杂图表的绘制，同时使用ECharts完成简单图表的展现，而表格数据的展现使用EasyUI。后端使用spring mvc+MyBatis框架。</p>
                            <img class="cover" src="img/ecap.png">
                            <img class="cover" src="img/ll.png">
                        </li>
                    </ul>
                    <h3>校内项目</h3>
                   	<br />
                    <ul class="exp">
                        <li>
                            <div class="circle"></div>
                            <h4>
                              	  浦镇科技生产管理系统（2015年6月-2016年6月/三人合作）
                            </h4>
                            <span>项目描述</span><p>包含月度计划、排产计划、日计划、配送箱、变更记录等模块的生产管理系统。</p>
                        	<span>责任描述</span><p>负责配送箱管理和变更记录模块;负责整个管理系统的页面样式设计;负责管理系统帮助页面的完成。
							<span>关键技术</span><p>jquery、css、ssh。</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>“快递看看”快递查询系统（2016年5月/2人合作）</h4>
                            <span>项目描述</span><p>由快递查询,查询结果分享,第三方登录等模块组成。</p>
                        	<span>责任描述</span><p>负责所有前端设计和编写;负责部分页面的响应式;第三方分享功能。</p>
							<span>关键技术</span><p>rest /ssh 、html5、css3、bootstrap。</p>
                        </li>
                         <li>
                            <div class="circle"></div>
                            <h4>图书管理系统(2016年5月/独立完成)</h4>
                            <span>项目描述</span><p>由图书借书还书，管理员登录等模块组成。</p>
                        	<span>责任描述</span><p>独立完成</p>
							<span>关键技术</span><p>ssh 、html5、css3、bootstrap。</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>云计算调度算法（2016年4 -5月/3人合作）</h4>
                            <span>项目描述</span><p>使用cloudsim模拟云计算的调度算法。</p>
                        	<span>责任描述</span><p>主要负责cloudsim的使用即主函数的编写；负责“先来先服务”算法的编写；负责谷歌数据集的规格化；负责测试用例的生成。</p>
							<span>关键技术</span><p>java 、cloudsim。</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>在线服装购买系统（2015年4-5月/独立完成）</h4>
                            <span>项目描述</span><p>衣服展示,购物车,登录注册等功能。</p>
                        	<span>责任描述</span><p>独立完成。</p>
							<span>关键技术</span><p>mvc/ssh，HTML，CSS</p>
                        </li>
                    </ul>
                </li>
                <li>
                    <dt><i class="icon-bookmark"></i>技能栈</dt>
                    <h3>Web前端</h3>
                    <ul class="exp">
                        <li>
                            <div class="circle"></div>
                            <h4>HTML / CSS</h4>
							<p>能够编写语义化的 HTML，模块化的 CSS，完成较复杂的布局</p>
							<p>对JSON和AJAX等技术均熟练使用</p>
                            <p>了解 Less / Sass等CSS预处理和后处理方法、工具</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>HTML5 / CSS3</h4>
                            <p>熟练使用HTML5 canvas画图技术</p>
                            <p>熟悉CSS3动画制作</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>JavaScript</h4>
                            <p>熟练掌握jQuery，zrenderJs，Echarts,EasyUI,bootstrap以及原生js的使用</p>
                            <p>熟练运用模块化、面向对象的方式编程</p>
                            <p>了解Node.Js,AngularJS 的使用</p>
                        </li>
                    </ul>
                    <h3>后端</h3>
                    <ul class="exp">
                        <li>
                            <div class="circle"></div>
                            <h4>框架</h4>
                            <p>熟悉 Java的使用.</p>
                            <p>熟练掌握spring+struts+hibernate的使用.</p>
                            <p>熟练掌握spring+struts+MyBatis框架的使用.</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>数据库</h4>
                            <p>项目中使用过oracle,sql server,mysql,Neo4j数据库</p>
                            <p>熟练掌握SQl语言,对图数据库Cypher语言有一定了解可以简单使用.</p>
                        </li>
                    </ul>
                    <h3>其他</h3>
                    <ul class="exp">
                        <li>
                            <p>GIT,SVN等版本控制软件熟练掌握</p>
                            <p>对各种流行的IDE都有所了解</p>
                            <p>可以熟练重装电脑系统,熟练对电脑拆装机,可独自实现简单的硬件维修</p>
                        </li>
                    </ul>
                </li>
                <li>
                    <dt><i class="icon-bookmark"></i>我的其他</dt>
                    
                    <ul class="exp">
                    	<li>
                            <div class="circle"></div>
                            <h4>教育经历</h4>
							<p>2010-2013： 江苏省新海高级中学 </p>
							<p>2013-2017： 三江学院(2017.6毕业)</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h3>社会及校内实践</h3>
                            <p>从初中开始担任班级生活委员，并参与和主持几乎所有班级活动的筹备工作包括主题班会和各种晚会；</p>
							<p>大一暑假在电脑店做兼职，主要做对pc和服务器的清灰以及操作系统的重装；</p>
							<p>校运动会开场舞二等奖；</p>
							<p>校 “红五月”大合唱比赛一等奖；</p>
							<p>校太极拳团体第三名、个人第五名；</p>
							<p>校“阳光周”先进个人（笔记本义修）；</p>
							<p>多次参加义务献血</p>
                        </li>
                        <li>
                            <div class="circle"></div>
                            <h4>个人评价</h4>
							<p>幽默、自信、善于和人沟通，并有一定的组织管理能力；</p>
							<p>外向、健谈、喜欢新的经验与尝试，尤其喜欢在旅行中经历新事物、接触新的人；</p>
							<p>拥有十分强烈的责任心，对待工作认真负责，总会倾尽全力；</p>
							<p>学习能力、适应力强，可以很快的适应新环境；</p>
							<p>善于运用工具，可以灵活多变的达成目的。</p>
                        </li>
                        
                    </ul>
                    
                </li>
            </ul>
        </div>
    </div>
    <footer><p> @ 2019-4-1 17:33:59</p></footer>
    
    <script type="text/javascript">
    	 $(function () {
	        $('.main').on('click', 'img', function () {
	            var this_ = $(this);
	            var images = this_.parents('.main').find('.cover');
	            console.log(this_);
	            var imagesArr = new Array();
	            var imagesTitle = new Array();
	            $.each(images, function (i, image) {
	            	let $img = $(image);
	            	$img.attr('data-index',i);
	                imagesArr.push($img.attr('src'));
	                imagesTitle.push($img.attr("alt"));
	            });
	            
	            console.log(imagesArr);
	            console.log(this_.data('index'));
	            $.pictureViewer({
	                images: imagesArr, //需要查看的图片，数据类型为数组
	                imagesTitle: imagesTitle, //需要查看的图片标题，数据类型为数组
	                initImageIndex: this_.data('index') + 1, //初始查看第几张图片，默认1
	                scrollSwitch: true //是否使用鼠标滚轮切换图片，默认false
	                
	            });
	        });
			// 基于准备好的dom，初始化echarts实例
			var myChart = echarts.init(document.getElementById('skillDiv'));

			var option = {
				series: [{
					type: 'treemap',
					data: [{
						name: 'nodeA',            // First tree
						value: 10,
						children: [{
							name: 'nodeAa',       // First leaf of first tree
							value: 4
						}, {
							name: 'nodeAb',       // Second leaf of first tree
							value: 6
						}]
					}, {
						name: 'nodeB',            // Second tree
						value: 20,
						children: [{
							name: 'nodeBa',       // Son of first tree
							value: 20,
							children: [{
								name: 'nodeBa1',  // Granson of first tree
								value: 20
							}]
						}]
					}]
				}]
			};

			// 使用刚指定的配置项和数据显示图表。
			myChart.setOption(option);
			
			
			
	    });
    </script>
   
</body>
</html>
